<%@page isELIgnored="false" pageEncoding="UTF-8" contentType="text/html; UTF-8" %>

<script>
    $(function () {
        $("#albumlist").datagrid({
            url:"${pageContext.request.contextPath}/getAlbums",
            pagination:true,
            toolbar:"#tb",
            columns:[[
                {field:'id',title:'ID',width:100},
                {field:'name',title:'Name',width:100},
                {field:'albumAuthor',title:'AUTHOR',width:100,align:'right'},
                {field:'albumTeller',title:'TELLER',width:100,align:'right'},
                {field:'albumEpisodes',title:'EPISODES',width:100,align:'right'},
                {field:'albumDate',title:'DATE',width:100,align:'right'},
                {field:'albumContent',title:'CONTENT',width:100,align:'right'},
                {field:'albumStar',title:'STAR',width:100,align:'right'},
            ]],
            onDblClickRow:function(rowIndex, rowData){
                $('#updatealbumdialog').dialog("open");

                $("#albumId").val(rowData.id);
                $("#albumName").val(rowData.name);
                $("#albumAuthor").val(rowData.albumAuthor);
                $("#albumTeller").val(rowData.albumTeller);
                $("#albumContent").val(rowData.albumContent);
                $("#albumStar").val(rowData.albumStar);
            }
        });


        $('#adddialog').dialog({
            title: '添加专辑',
            width: 300,
            height: 300,
            closed: true,
            buttons:"#addbtn",

        });
        $('#updatedialog').dialog({
            title: '修改专辑',
            width: 300,
            height: 300,
            closed: true,
            buttons:"#updatebtn",

        });

        $('#updatealbumdialog').dialog({
            title: '添加专辑',
            width: 300,
            height: 300,
            closed: true,
            buttons:"#updateAlbumbtn",

        });
    })

    function openaddDialog(){
        $('#adddialog').dialog("open");
    }



    function doadd(){

        $('#addform').form('submit', {
            url:"${pageContext.request.contextPath}/addalbum",
            onSubmit: function(){
                // do some check
                // return false to prevent submit;
                return true;
            },
            success:function(data){
                var jsobj=JSON.parse(data);
                $.messager.alert('我的消息',jsobj.message,'info');
                $("#albumlist").datagrid("load");
                $('#adddialog').dialog("close");
            }
        });

    }

    function deletechecked(){

        var rows=$("#albumlist").datagrid("getSelections");
        var ids = new Array();
        for(var i=0;i<rows.length;i++){
            ids[i]=rows[i].id;
        }
        $.ajax({
            url:"${pageContext.request.contextPath}/deletealbum",
            data:"ids="+ids,
            type:"post",
            success:function(data){
                $.messager.alert('我的消息',data.message,'info');
            }
        })
    }



    function doupdatealbum(){
        $('#updatealbumform').form('submit', {
            url:"${pageContext.request.contextPath}/updatealbum",
            onSubmit: function(){
                // do some check
                // return false to prevent submit;
                return true;
            },
            success:function(data){
                var jsobj=JSON.parse(data);
                $.messager.alert('我的消息',jsobj.message,'info');
                $("#albumlist").datagrid("load");
                $('#updatealbumdialog').dialog("close");
            }
        });
    }

</script>


<table id="albumlist"></table>


<div id="tb">
    <a href="javascript:openaddDialog()" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">添加</a>
    <a href="javascript:deletechecked()" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">删除选中</a>
</div>

<div id="adddialog">
    <form id="addform" method="post" >
        专辑名： <br><input name="albumName">    <br>
        专辑作者： <br><input name="albumAuthor">    <br>
        播音员： <br><input name="albumTeller">    <br>
        简介： <br><textarea name="albumContent"></textarea><br>
        专辑评分： <br><input name="albumStar">    <br>
    </select>
    </form>

</div>
<div id="addbtn">
    <a href="javascript:doadd()" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">确认</a>
    <a href="javascript:canceladd()" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">取消</a>
</div>
<div id="updatedialog">
    <form id="updateform" method="post">
        <input type="hidden" id="updateId" name="articleId">
        文章标题：<input name="articleName" id="articleName">    <br>
        文章内容：<textarea name="articleContent" id="articleContent"></textarea><br>
        所属大师：<select id="updateguruname" name="guruId">

    </select>

    </form>
</div>
<div id="updatebtn">
    <a href="javascript:doupdate()" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">确认</a>
    <a href="javascript:cancelupdate()" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">取消</a>
</div>


<div id="updatealbumdialog">
    <form id="updatealbumform" method="post" >
        <input type="hidden" name="albumId" id="albumId">
        专辑名： <br><input name="albumName" id="albumName">    <br>
        专辑作者： <br><input name="albumAuthor" id="albumAuthor">    <br>
        播音员： <br><input name="albumTeller" id="albumTeller">    <br>
        简介： <br><textarea name="albumContent" id="albumContent"></textarea><br>
        专辑评分： <br><input name="albumStar" id="albumStar">    <br>
        </select>
    </form>

</div>
<div id="updateAlbumbtn">
    <a href="javascript:doupdatealbum()" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">确认</a>
</div>